<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

</head>
<body>

<p id="js">javaScript</p>
<div id="list">
  <p id="se">javaSe</p>
  <p id="ee">javaEE</p>
  <p id="me">javaME</p>
</div>

<script>
  'use strict';
  var js = document.getElementById("js"); // 已存在的节点
  var list = document.getElementById("list");
  list.appendChild(js); // 追加

  // 通过js 创建一个新的节点
  var newP = document.createElement('p'); // 创建一个p标签 ---》<p></>p>
  /* newP.setAttribute(id,'newP'); // 公用的写法，等价于<p id = "newP"></p> */
  newP.id = 'newP';                   // ---》 <p id = "newP"></p>
  newP.innerText = 'Hello,zjz';    // ---》 <p id = "newP">Hello,zjz</p>

  list.appendChild(newP);

    // 创建script，并赋属性值
  var myScript = document.createElement('script');
  myScript.setAttribute('type','text/javascript');


  // 创建style， 并赋值
  var myStyle = document.createElement('style');
  myStyle.setAttribute('type','text/css');
  myStyle.innerHTML = 'body{background-color:chartreuse;}';

  document.getElementsByTagName('head')[0].appendChild(myStyle);








</script>

</body>
</html>